<template>
    <!-- 消息设置菜单项显示内容 -->
    <div id="message-advise-settings-contrainer">
        <el-row>
            <div id="message-notice-top">
                <span>
                    评论消息提醒设置
                </span>
                <span>
                    <el-switch
                        v-model="commentTip"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </span>
            </div>
            <div id="message-notice-bottom">
                有人对我的内容进行评论时，我会收到消息提醒
            </div>
        </el-row>
        <el-divider/>
        <el-row>
            <div id="message-notice-top">
                <span>
                    关注消息提醒设置
                </span>
                <span>
                    <el-switch
                        v-model="payAttentionTip"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </span>
            </div>
            <div id="message-notice-bottom">
                有人关注我后会收到消息提醒
            </div>
        </el-row>
        <el-divider/>
    </div>    
</template>
<script>
export default {
    name: 'AdviseSettings',
    data() {
        return {
            commentTip: true,
            payAttentionTip: true
        }
    }
}
</script>
<style>
    #message-notice-top > span:last-child {
        float: right;
    }
    #message-notice-bottom {
        margin-top: 8px;
        font-size: 14px;
        color: #909399;
    }
    #message-advise-settings-contrainer .el-divider {
        margin: 16px auto;
    }
</style>